<script type="text/javascript" src="/js/our_js/interactive_select.js"></script>
<script type="text/javascript" src="/js/our_js/selection_context_site.js"></script>
<!-- Main content wrapper -->
<div class="wrapper">
    
    <form enctype="multipart/form-data" action="addcampaignfirst" method="POST" id="validate" class="form" style="margin-top:5%;">
        <div class="widget">
            <table style="width:100%; margin-top:20px;">
                <tbody>

                    <tr>
                        <td style="width:35%;">
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Название кампании:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text" value="" name="company_name" /></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата начала:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 80px; width: 180px;">
                                    <input type="text" class="datepicker" name="date_start" value="" />
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата окончания:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 60px; width: 220px;">
                                    <input type="text" class="datepicker" name="date_end" value="" />
                                </div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div class="formRow">
                                <label>Бюджет кампании:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur" value="10" name="budget" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Недельный бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur2" value="10" name="week_budget" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дневной бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur1" value="10" name="day_budget" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td style="text-align:left;">
                            <div class="formRow">
                                <label>Тематика рекламы:</label>
                                <div class="formRight" style="margin-right:0; width: 220px;">
                                    <select name="category_adv" id="category_adv" >
                                        <?php foreach ($this->allCategories as $category) : ?>
                                            <option value="<?php echo $category['id']; ?>"><?php echo $category['name']; ?></option>             
                                        <?php endforeach; ?>
                                    </select>           
                                </div>
                                <div class="clear"></div>						
                            </div>
                        </td>
                        <td>
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>URL сайта:</label>
                                <div class="formRight" style="margin-right:30px; width: 200px;">
                                    <input type="text" value="" name="site_url"/></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Лицензия:</label>
                                <div class="formRight" style="margin-right:30px; width: 200px;">
                                    <input type="text" value="" name="license"/></div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td style="text-align:left;">
                            <div class="formRow">
                                <label>География показа стран:</label>
                                <div class="formRight" style="margin-right:0; width: 200px;">
                                    <select id='geography' onchange="addRegions();" multiple="multiple" class="multiple" name="geography_countries[]" title="Click to Select a Country">
                                        <?php foreach ($this->allCountries as $key => $country) : ?>
                                            <option value="<?php echo $country['id']; ?>"><?php echo $country['name']; ?></option>                                                 
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                <div class="clear"></div>
                            </div>
                            
                            <div class="formRow">
                                <label>География показа регионов:</label>
                                <div class="formRight" style="margin-right:0; width: 200px;">
                                    <select id="regions" multiple="multiple" class="multiple" name="geography_regions[]" title="Click to Select a region">                                              
                                    </select>
                                </div>
                                <div class="clear"></div>
                            </div>                                                          
                            
                        </td>
                        <td colspan=2>
                            форма для выбора времени показа
                        </td>
                    </tr>

                </tbody>
            </table>

            <div class="formRow" style="border-bottom-style: none; padding-bottom: 0px;">
                <label>Тип первого объявления:</label>
                <div class="formRight" >
                    <select id="select_type" name="type_adver" >
                        <option value="1">баннерное</option>
                        <option value="2">контекстное</option>
                        <option value="3">микроблог</option>
                        <option value="4">соц. сеть</option>
                        <option value="5">видеоконтекст</option>
                    </select>           
                </div>
                <div class="clear"></div>						
            </div>

            <div class="toggle">
                <div class="title closed"><img src="/images/icons/dark/list.png" alt="" class="titleIcon tipS" title="Sample tooltip" /><h6>Контактная информация для этой кампании</h6></div>
                <div class="body">

                    <table style="width:100%; margin-top:20px;">
                        <tbody>

                            <tr>
                                <td style="text-align:left;">
                                    <div class="formRow">
                                        <label>Страна:</label>
                                        <div class="formRight" style="margin-right:0; width: 220px;">
                                            <select name="country_contact">
                                                <?php foreach ($this->allCountries as $country) : ?>
                                                    <option value="<?php echo $country['id']; ?>"><?php echo $country['name']; ?></option>                                                    
                                                <?php endforeach; ?>
                                            </select>           
                                        </div>
                                        <div class="clear"></div>						
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Город:</label>
                                        <div class="formRight" style="margin-right:30px; width: 200px;">
                                            <input type="text" value="" name="city" /></div>
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Адрес:</label>
                                        <div class="formRight" style="margin-right:30px; width: 200px;">
                                            <input type="text" value="" name="address" /></div>
                                    </div>
                                </td>
                            </tr>

                            <tr>
                                <td>
                                    <div class="formRow">
                                        <label>Время работы:</label>
                                        <div class="formRight" style="width: 140px; margin-right: 40px;"><div title="пример: с пн по пт с 10:00 до 19:00" class="tipN" ><input type="text" class="maskTime" id="maskTime" value="" name="work_time"/></div></div>
                                        <div class="clear"></div>
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Телефон:</label>
                                        <div class="formRight" style="margin-right:30px; width: 200px;">
                                            <input type="text" value="" name="telephone" /></div>
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Контактный email:</label>
                                        <div class="formRight" style="margin-right:30px; width: 200px;">
                                            <input type="text" value="" name="email" /></div>
                                    </div>
                                </td>
                            </tr>

                            <tr>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Компания:</label>
                                        <div class="formRight" style="margin-right:30px; width: 180px;">
                                            <input type="text" value="" name="company" /></div>
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                        <label>Контактное лицо:</label>
                                        <div class="formRight" style="margin-right:30px; width: 200px;">
                                            <input type="text" value="" name="contact_person" /></div>
                                    </div>
                                </td>
                                <td>
                                    <div class="formRow">
                                        <div class="formRight">
                                            <input type="checkbox" name="create_mini_site" id="check2" /><label for="check2">Создать мини-сайт</label>
                                        </div><div class="clear"></div>
                                    </div>
                                </td>
                            </tr>

                        </tbody>
                    </table>		
                </div>
            </div>

            <div class="clear"></div>

        </div>


        <div class="widget" id="banner">
            <div class="title"><img src="/images/icons/dark/record.png" alt="" class="titleIcon" /><h6>Баннерное объявление</h6></div>

            <table style="width:100%; margin-top:20px;">
                <tbody>

                    <tr>
                        <td style="width:35%;">
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Название рекламы:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text" value="" name="name_banner" /></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата начала:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 80px; width: 180px;">
                                    <input type="text" class="datepicker" name="date_start_banner" />
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата окончания:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 60px; width: 220px;">
                                    <input type="text" class="datepicker" name="date_end_banner" />
                                </div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div class="formRow">
                                <label>Бюджет объявления:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur4" value="10" name="budget_banner" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Недельный бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur5" value="10" name="week_budget_banner" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дневной бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur3" value="10" name="day_budget_banner" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>

            <table style="width:100%; margin-top: -10px;">
                <tbody>
                    <tr>
                        <td style="width:40%;">
                            <div class="formRow">
                                <label>Загрузка баннера:</label>
                                <div class="formRight" style="width:60%; margin-right: 30px;">
                                    <input type="file" id="file" name="image_file" />
                                </div><div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Ключевые слова:</label>
                                <div class="formRight" style="margin-right:20px; width: 78%;">
                                    <input type="text" value="" name="keywords_banner" /></div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>

            <div class="title" style="border-top-style:solid; border-top-color:	#CDCDCD; border-top-width: 1px;"><span class="titleIcon"><input type="checkbox" id="titleCheck" name="titleCheck" /></span><h6>Подходящие сайты</h6></div>
            <table cellpadding="0" cellspacing="0" width="100%" class="sTable withCheck" id="checkAll">
                <thead>
                    <tr>
                        <td><img src="/images/icons/tableArrows.png" alt="" /></td>
                        <td>Адрес</td>
                        <td>Кол-во подходящих мест</td>
                        <td>Ключевые слова</td>
                        <td>PR</td>
                        <td>ТИЦ</td>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><input type="checkbox" id="titleCheck2" name="checkRow" /></td>
                        <td>www.somesitewithlongdomain</td>
                        <td>5</td>
                        <td>Ключевые слова, слова, слова</td>
                        <td>10</td>
                        <td>9000</td>
                    </tr>
                    <tr>
                        <td><input type="checkbox" id="titleCheck2" name="checkRow" /></td>
                        <td>www.somesitewithlongdomain</td>
                        <td>5</td>
                        <td>Ключевые слова, слова, слова</td>
                        <td>10</td>
                        <td>9000</td>
                    </tr>
                    <tr>
                        <td><input type="checkbox" id="titleCheck2" name="checkRow" /></td>
                        <td>www.somesitewithlongdomain</td>
                        <td>5</td>
                        <td>Ключевые слова, слова, слова</td>
                        <td>10</td>
                        <td>9000</td>
                    </tr>
                    <tr>
                        <td><input type="checkbox" id="titleCheck2" name="checkRow" /></td>
                        <td>www.somesitewithlongdomain</td>
                        <td>5</td>
                        <td>Ключевые слова, слова, слова</td>
                        <td>10</td>
                        <td>9000</td>
                    </tr>
                    <tr>
                        <td><input type="checkbox" id="titleCheck2" name="checkRow" /></td>
                        <td>www.somesitewithlongdomain</td>
                        <td>5</td>
                        <td>Ключевые слова, слова, слова</td>
                        <td>10</td>
                        <td>9000</td>
                    </tr>
                </tbody>
            </table>

        </div>

        <div class="widget" id="context">
            <div class="title" ><img src="/images/icons/dark/record.png" alt="" class="titleIcon" /><h6>Контекстное объявление</h6></div>

            <table style="width:100%; margin-top:20px;">
                <tbody>

                    <tr>
                        <td style="width:35%;">
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Название объявления:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text" value="" name="name_ad"/></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата начала:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 80px; width: 180px;">
                                    <input type="text" class="datepicker" name="date_start_ad"/>
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата окончания:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 60px; width: 220px;">
                                    <input type="text" class="datepicker" name="date_end_ad" />
                                </div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div class="formRow">
                                <label>Бюджет объявления:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur6" value="10" name="budget_ad" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Недельный бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur7" value="10" name="week_budget_ad" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дневной бюджет:</label>
                                <div class="formRight" style="width:50%">
                                    <input type="text" id="sCur8" value="10" name="day_budget_ad" />
                                </div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div class="formRow" style="border-bottom-style: none;">
                                <label>Заголовок объявления:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text" value="" name="header_ad" /></div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td colspan=2>
                            <div class="formRow" style="border-bottom-style: none;">
                                <label>Ключевые слова:</label>
                                <div class="formRight" style="margin-right:20px; width: 78%;">
                                    <input type="text" value="" name="keywords_ad" id="keywords_ad" /></div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td colspan=3>
                            <div class="formRow">
                                <label>Текст объявления:</label>
                                <div style="width:50px;heigth:50px;"><textarea rows="3" cols="" name="text_ad" id="text_ad" class="autoGrow lim" placeholder="Type something"></textarea></div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>

            <div id="suitable_sites" class="title" style="border-top-style:solid; border-top-color:	#CDCDCD; border-top-width: 1px;"><span class="titleIcon"><input type="checkbox" id="titleCheck" name="titleCheck" /></span><h6>Подходящие сайты</h6></div>
            <table cellpadding="0" cellspacing="0" width="100%" class="sTable withCheck" id="checkAll">
                <thead>
                    <tr>
                        <td><img src="/images/icons/tableArrows.png" alt="" /></td>
                        <td>Адрес</td>
                        <td>Кол-во подходящих мест</td>
                        <td>Ключевые слова</td>
                        <td>PR</td>
                        <td>ТИЦ</td>
                    </tr>
                </thead>
                <tbody id="fckn_id">                    

                </tbody>
            </table>

        </div>

        <div class="widget" id="soc_seti">
            <div class="title"><img src="/images/icons/dark/record.png" alt="" class="titleIcon" /><h6>Реклама в социальной сети или микроблоге</h6></div>

            <table style="width:100%; margin-top:20px;">
                <tbody>

                    <tr>
                        <td style="width:35%;">
                            <div class="formRow" style="border-bottom-style: none; padding-top: 0px; padding-bottom: 0px;">
                                <label>Название рекламы:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text" value="" name="name_adver_social"/></div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата начала:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 80px; width: 180px;">
                                    <input type="text" class="datepicker" name="date_start_social" />
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="formRow">
                                <label>Дата окончания:</label>
                                <div class="formRight" style="float:none; margin-right:0; margin-left: 60px; width: 220px;">
                                    <input type="text" class="datepicker" name="date_end_social" />
                                </div>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div class="formRow" style="border-bottom-style: none;">
                                <label>Стоимость рекламы:</label>
                                <div class="formRight" style="margin-right:10px; width: 200px;">
                                    <input type="text"  value="" name="cost_adver_social" /></div>
                                <div class="clear"></div>
                            </div>
                        </td>
                        <td colspan=2>
                            <div class="formRow">
                                <label>Описание:</label>
                                <div class="formRight"><textarea rows="3" cols="" name="description_social" class="autoGrow lim" placeholder="Type something"></textarea></div>
                                <div class="clear"></div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>

        </div>        
        <div class="loginControl" style="width: 160px; float:left;">
            <input type="button" onclick="selectionContext();" name="get sites" value="show suitable sites" class="greenB" />
            <div class="clear"></div>
        </div>
        <div class="loginControl" style="width: 160px; float:right;">
            <input type="submit" name="testfirst" value="Save campaign" class="greenB" />        
            <div class="clear"></div>
        </div>
    </form>   
   </div> 
<script type="text/javascript">
                 
    $('#banner').show();
    $('#context').hide();
    $('#soc_seti').hide();
                   
                   
    $('#select_type').change(function(){
                           
        if($('#select_type').val() == '1') {
            $('#banner').show();
            $('#context').hide();
            $('#soc_seti').hide();
        } else if ($('#select_type').val() == '2') {
            $('#context').show();
            $('#banner').hide();
            $('#soc_seti').hide();
        } else if ($('#select_type').val() == '3') {
            $('#context').hide();
            $('#banner').hide();
            $('#soc_seti').show();
        } else if ($('#select_type').val() == '4') {
            $('#context').hide();
            $('#banner').hide();
            $('#soc_seti').show();
        } else if ($('#select_type').val() == '5') {
            alert('select context_video');
        }
                        
    });
                        
    // });
</script>
